<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>闲云公子 首页</title>
	<link rel="stylesheet" href="fonts/glyphicons/css/glyphicons.css">
	<link rel="stylesheet" href="css/common.css">
	<link rel="stylesheet" href="css/index.css">
</head>
<body>
<div id="to-top" class="selected">
	<span class="glyphicon glyphicon-plane"></span>
</div>
<div id="music">
	<span class="glyphicon glyphicon-music"></span>
</div>
<div id="nav">
	<div class="wrapper">
		<div id="nav-left">
			<div id="nav-author">
				<div class="img-box">
					<img src="img/top-nav.jpg" alt="">
				</div>
			</div>
			<div class="nav-left homepages">
				<span class="glyphicon glyphicon-home"></span>
				<span>主页</span>
				<div id="tri-angle">
				</div>
				<div id="nav-sub">
				<div class="nav-main-left">
					<div class="nav-img-box">
						<img src="img/top-nav.jpg" alt="">
					</div>
					<p><a href="">主页</a></p>
				</div>
				<div class="nav-main-right">
					<ul>
						<li class="nav-right-box">
							<div>
								<div class="nav-img-box">
									<img src="img/top-nav.jpg" alt="">
								</div>
								<p><a href="">动态</a></p>
							</div>
							<div>
								<div class="nav-img-box">
									<img src="img/top-nav.jpg" alt="">
								</div>
								<p><a href="">日记</a></p>
							</div>
							<div>
								<div class="nav-img-box">
									<img src="img/top-nav.jpg" alt="">
								</div>
								<p><a href="">相册</a></p>
							</div>
							<div>
								<div class="nav-img-box">
									<img src="img/top-nav.jpg" alt="">
								</div>
								<p><a href="">音乐</a></p>
							</div>
						</li>
						<li class="nav-right-box">
							<div>
								<div class="nav-img-box">
									<img src="img/top-nav.jpg" alt="">
								</div>
								<p><a href="">留言板</a></p>
							</div>
							<div>
								<div class="nav-img-box">
									<img src="img/top-nav.jpg" alt="">
								</div>
								<p><a href="">个人档</a></p>
							</div>
						</li>
					</ul>
				</div>
			</div>
			</div>
			<div class="nav-left">
				<span class="glyphicon glyphicon-transfer"></span>
				<span>动态</span>
			</div>
			<div class="nav-left">
				<span class="glyphicon glyphicon-heart"></span>
				<span>亲密度&nbsp;54</span>
			</div>
		</div>

		<div id="nav-right">
			<div>音乐播放</div>
			<div id="nav-search">
				<input   type="text" placeholder=" 用户/应用/动态">
				<span class="glyphicon glyphicon-search"></span>
			</div>
			<div>返回个人中心</div>
			<div></div>
			<div></div>
			<div></div>
		</div>
	</div>
</div>
<div id="head" >
	<div id="player">
		<audio  autoplay="autoplay" controls="controls" style="width:170px;" loop="loop">
			<!--preload="true" -->
			<source src="music/Melody Of The Night 5.mp3" type="audio/mpeg"/>
			<source src="music/ideal.mp3" type="audio/mpeg" />
		</audio>
	</div>
	<div id="top" class="wrapper">
        <div>
            <div id="head-img-box">
                <img src="img/top-nav.jpg" alt="">
            </div>
            <div id="head-content">
                <h1>闲云公子</h1>
                <p>认真且怂，从一而终。</p>
            </div>
        </div>
	</div>
	<div id="today">
		<div id="local">local</div>
		<div id="weather">weather</div>
		<div id="date">d</div>
	</div>
</div>
<div id="content-box">
	<div id="left-box">
		<div id="my-photo">
			<img src="img/top-nav.jpg" alt="">
		</div>
		<div id="my-name"><span class="glyphicon glyphicon-user">&nbsp;lifei</div>
		<div id="signature">
			<p>&nbsp;个性签名:</p>
			<br>
			<p>无人与我立黄昏</p>
			<br>
			<p>无人问我粥可温</p>
			<p></p>
		</div>
		<div id="contact">
			<p><span class="glyphicon glyphicon-envelope"></span>&nbsp;Email: <a href="mailto:lifei0918@outlook.com" >lifei0918@outlook.com</a></p>
			<p><span class="glyphicon glyphicon-phone-alt"></span>&nbsp;Phone Number:<a href="">1234567890</a></p>
			<p><span class="glyphicon glyphicon-chevron-right"></span> live chat<a href="">sprite img insert</a></p>
			<p><a href="">more&gt;&gt;</a>
			</p>
		</div>
		<div id="recently">
			<ul>
				<li>无眠。05.02</li>
				<li>不负如来不负卿。04.27</li>
				<li>你好，能不能借一生说话。03.18</li>
				<li></li>
			</ul>
		</div>
		<div id="visitor">
			<ul>
				<li>安锦</li>
				<li>世界蜗居</li>
				<li>如梦</li>
				<li>贪欢</li>
			</ul>
		</div>
	</div>
	<div id="right-box" class="wrapper">
		<div id="tag">
			<ul>
				<li class="selected"><a href="#tag1">动态</a></li>
				<li><a href="#tag2">日记</a></li>
				<li><a href="#tag3">相册</a></li>
				<li><a href="#tag5">音乐</a></li>
				<li><a href="#tag4">留言板</a></li>
				<li><a href="#tag6">个人档</a></li>
			</ul>
		</div>
		<div id="content">
			<div id="tag1" class="selected ">
				<p>你若是不努力去试一试，你不会知道自己究竟能有多优秀！</p>
				<p>“穷则生变”是每个落魄人的本能。</p>
				<p>我和秦科不同，我的学习目标是不求完美无缺，但求有惊无险。我也就是那种从思想上到行为上统一懈怠，不思进取的人。</p>
				<a href="">more &gt;&gt; </a>
				<div class="info-box"></div>
			</div>
			<div id="tag2">
				<p>
					我44岁的时候，<br>
					在经营中被骗了200万，<br>
					被国企南油集团除名，<br>
					曾求留任遭拒绝，<br>
					还背负还清200万债。<br>
					妻子又和我离了婚，<br>
					我带着老爹老娘弟弟妹妹在深圳住棚屋，<br>
					创立华为公司。<br>
					我没有资本、没有人脉、没有资源、没有技术、没有市场经验，<br>
					我唯有勇敢向前，<br>
					我用了27年把华为带到世界500强，行业世界第一的位置。<br>
					我不觉得跌倒可怕，可怕的是再也站不起来！<br>
					----------任正非
				</p>
				<p>
					我想起了邻居家的小土狗，每次桌上放了好吃东西它都很精神，但是那是主人吃的，最后给他的不过是一点残羹冷饭，那时候它也会乖乖的过去，耷拉着耳朵把不好吃的东西吃了。无论如何……
				</p>
				<a href="diary.html">more&gt;&gt;</a>
			</div>
			<div id="tag3">
				<div>
					<ul>
						<li><img src="img/002.jpg" alt=""></li>
						<li><img src="img/003.jpg" alt=""></li>
					</ul>
				</div>
				<div>
					<ul>
						<li><img src="img/004.jpg" alt=""></li>
						<li><img src="img/005.jpg" alt=""></li>
					</ul>
				</div>
				<a href="">more&gt;&gt;</a>
			</div>
            <div id="tag5">
            <div>
                <div>Please wait for more games.</div>
                <div class="img-box"><img src="img/006.jpg" alt=""></div>
            </div>
            <a href="">more&gt;&gt;</a>
        </div>
			<div id="tag4">
				<p>老来多健忘</p>
				<p>师兄说华山的红叶马上就可以看了，肯定红了一大片了，他抽空到西安来，一起去华山，可以看日出</p>
				<a href="">more&gt;&gt;</a>
			</div>

			<div id="tag6">
				<p>Name: LiFei</p>
				<p>Gender:male</p>
				<a href="">more&gt;&gt;</a>
				<p>Age:24</p>
				<p>Graduate from <a href="">YanTai University</a></p>
				<p>Education Background:
					<p> junior middle school:</p>
					<p> senior middle school:</p>
					<p>University:</p>
				</p>
				<p>Work:</p>
				<p>Hobby:</p>
				<p>Location:</p>
			</div>
		</div>
	</div>
</div>
<div id="footer" >
	<div class="wrapper">
		<p>I hope everybody here is happy.</p>
		<p><span></span></p>
	</div>
</div>
<script src="js/common.js"></script>
<script src="js/index.js"></script>
</body>
</html>